iT邦幫忙

2025 iThome 鐵人賽

DAY 11
0
Modern Web

Modern Web學習札記:初學者的探索系列 第 20

Day 20:函式:把程式邏輯打包起來

  • 分享至 

  • xImage
  •  

在前面三天的學習中,我先掌握了「變數與資料型別」,知道如何儲存資料,接著學會了「條件判斷」,讓網頁能依據不同情況做出選擇,再到今天的主題——「迴圈」,了解如何自動重複執行程式碼。這三個概念為函式的學習奠定了堅實的基礎,因為函式就是把這些邏輯打包起來,變成可以重複使用的單位,讓程式更有組織、更容易維護。

函式(Function)可以理解成一個「小工具箱」,裡面裝著程式碼邏輯,只要呼叫函式,就能執行其中的動作,而不需要每次都寫重複的程式碼。基本語法如下:

function greet(name) {
console.log("Hello, " + name + "!");
}
greet("Berry");
greet("Alice");

這段程式中,我們定義了一個 greet 函式,傳入不同的名字就能輸出不同的問候語。這樣不僅簡化程式碼,也提高重複使用的便利性。函式還可以傳入多個參數,甚至有回傳值,用於計算、判斷或操作資料,功能非常強大。

函式的好處很多。首先,它讓程式更有條理,把一個完整的邏輯分成多個小單位,每個單位只負責特定功能,方便日後維護或修改。其次,函式可以搭配變數、條件判斷和迴圈使用,實現更複雜的操作,例如計算學生成績、生成動態表格或批量處理資料。再者,函式可以重複使用,節省撰寫時間,也讓程式更具可擴展性。

舉例來說,假設我想計算一個陣列中所有數字的總和,沒有函式的話可能需要手動寫多行累加程式,但用函式可以這樣寫:

function sumArray(arr) {
let total = 0;
for (let i = 0; i < arr.length; i++) {
total += arr[i];
}
return total;
}
console.log(sumArray([1, 2, 3, 4, 5]));

這個函式結合了迴圈與變數,清楚地完成計算工作,只要呼叫一次函式,就能處理不同的陣列,既簡單又高效。

學習心得:
我覺得函式是程式設計中非常核心的概念,它不僅讓程式碼更乾淨、有組織,也讓邏輯更容易理解。經過前面學習變數、條件判斷和迴圈,我開始理解如何把這些概念整合到函式中,使程式可以重複使用、靈活調整。函式像是程式的積木,能組合成各種功能模組,打造互動網頁或應用程式。學會函式後,我對寫程式的信心更高,也期待能運用函式開發更多互動功能,讓網頁真正變得「智慧化」且高效。


上一篇
Day 19:迴圈:重複動作的好幫手
系列文
Modern Web學習札記:初學者的探索20
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言